<template>
	<!-- 工具借出提交-->
	<view>
		<view class="detail-wrap" v-if="false">
			<view class="detail-row">
				<view class="detail-row-label">
					<text>归还人</text>
				</view>
				<view class="detail-row-value">
					{{ mainTable.BACKBY }}
				</view>
			</view>
			<view class="detail-row" @click="dateEvent('BACKDATE')">
				<view class="detail-row-label">
					<text>归还时间</text>
				</view>
				<view class="detail-row-value text-blue" >
					{{ mainTable.BACKDATE }}
				</view>
			</view>

			<view class="detail-row">
				<view class="detail-row-label">
					<text>备注</text>
				</view>
				<view class="detail-row-value">
					<input type="text" class="text-black" v-model="mainTable.VMEMO" placeholder="请输入备注" />
				</view>
			</view>
		</view>

		<view class="detail-sub-wrap position-r" v-for="(item,index) in materList">
			
			<view class="detail-row">
				<view class="detail-row-label">
					<text>工具单号</text>
				</view>
				<view class="detail-row-value text-blue">
					{{ item.PK_MATERIAL || '' }}
				</view>
			</view>
			<view class="detail-row">
				<view class="detail-row-label">
					<text>工具名称</text>
				</view>
				<view class="detail-row-value">
					{{ item.MATERIALNAME  }}
				</view>
			</view>
			<view class="detail-row">
				<view class="detail-row-label">
					<text>规格</text>
				</view>
				<view class="detail-row-value">
					{{ item.MATSPEC  }}
				</view>
			</view>
			
			<view class="detail-row">
				<view class="detail-row-label">
					<text>借出货位</text>
				</view>
				<view class="detail-row-value">
					{{ item.STATIONNAME  }}
				</view>
			</view>
			
			<view class="detail-row"  v-if="orderType==1">
				<view class="detail-row-label">
					<text>状态</text>
				</view>
				<view class="detail-row-value">
				 <text :class="item.VDEF20!=1?'text-green':'text-red' ">
					 {{ item.VDEF20 != 1?"正常":'非借出货位归还'  }}
				 </text>	
				</view>
			</view>
			
			<view class="detail-row">
				<view class="detail-row-label">
					<text>借出数量</text>
				</view>
				<view class="detail-row-value">
					{{ item.LENDNNUM  || '0' }}
				</view>
			</view>
			<view class="detail-row">
				<view class="detail-row-label">
					<text>归还数量</text> 
				</view>
				<view class="detail-row-value">
					<input type="number"  class="text-black" v-model="item.NNUM" placeholder="请输入归还数量" />
				</view>
			</view>
			
			<!-- <view class="detail-row" v-if="orderType==1">
				<view class="detail-row-label">
					<text class="ban-flag">归还数量</text>
				</view>
				<view class="detail-row-value">
					<input type="number" class="text-black" v-model="item.RENNUM" placeholder="请输入归还数量" />
				</view>
			</view>
			
			<view class="detail-row" v-if="orderType==1">
				<view class="detail-row-label">
					<text class="ban-flag">说明</text>
				</view>
				<view class="detail-row-value">
					<input type="text" class="text-black" v-model="item.VMEMO" placeholder="请输入未原位归还的说明" />
				</view>
			</view> -->

		</view>

		<view class="detail-wrap-btn">
			<button class="cu-btn block bg-blue margin-tb-sm lg" @click="submit">
				提交
			</button>
		</view>

		<w-picker mode="date" startYear="2000" endYear="2050" step="1" :defaultVal="[1,1,1,1,2,5]" :current="true" @confirm="onConfirm"
		 ref="dateTime" themeColor="#f00"></w-picker>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	import wPicker from "@/components/w-picker/w-picker.vue";
	import api from '@/common/api.js'
	let _self, dateTimekey, activeIndex, activeType ;
	
	let query = {
		category: "",
		page: 1,
		rows: 500,
		sidx: "",
		IsReturn:1 ,
		sord: "desc",
		queryJson: {},
		userId: "",
		account: ""
	};
	
	export default {
		computed: mapState(['userInfo', 'checkData']),
		components: {
			wPicker
		},
		data() {
			return {
				orderType: 0, // 0 是借出  1 是归还
				mainTable: {
					BILLNO: '',
					FRBILLNO: '',
					APPLYER: '',
					APPLYERTEL: '',
					BACKBY: '',
					BACKDATE: '',
					VMEMO: '',
					VDEF20: 0 ,
					APPLYTYPE: 0
				},
				materList: []
			};
		},
		onLoad(p) {
			_self = this
			this.orderType = p.t
			this.mainTable.APPLYTYPE = p.t
			// console.log(this.userInfo);
			this.materList = this.checkData
			this.mainTable.BACKBY = this.userInfo.REALNAME
			this.mainTable.BACKDATE = this.$utils.getToDay(0)
			// if (p.t == 0) {
			// 	this.materList = this.checkData
			// 	this.mainTable.APPLYER = this.userInfo.REALNAME
			// 	this.mainTable.BACKBY = this.userInfo.REALNAME
			// 	this.mainTable.APPLYERDATE = this.$utils.getToDay(0)
			// 	this.mainTable.BACKDATE = this.$utils.getToDay(2)
			// 	this.mainTable.userId = _self.userInfo.UserId
			// 	this.mainTable.account = _self.userInfo.Account
			// 	this.mainTable.APPLYERTEL = _self.userInfo.TELEPHONE
			// }else {
			// 	let abc = JSON.parse(decodeURIComponent(p.data));
			// 	this.mainTable = {...abc}
			// 	query.userId = _self.userInfo.UserId;
			// 	query.account = _self.userInfo.Account;
			// 	let a = {PK_OUTSTOCKRECORD:abc.BILLNO  }
			// 	query.queryJson = JSON.stringify(a);
			// 	// this.$utils.setPageTitle('工具归还')
			// 	this.getDetail()
			// }
		},
		onNavigationBarButtonTap(e) {
			e.index==0?this.addItem():_self.openScanMater()
		},
		methods: {
			...mapMutations([ 'deleteCheckData','setCheckData']),
			
			submit() {
				let URL = '/api/APPCommon/ReturnTool' // api.apiPublic.OutboundRecord;
				for(var i=0; i<this.materList.length ;i++ ){
					let t = this.materList[i] ;
					if(!t.NNUM){
						return this.$utils.tips('请输入归还数量')
					}
				}
				console.log(_self.materList);
				let savedata = { 
					PK_TOOLRECORD_DTL:this.materList[0].PK_TOOLRECORD_DTL,
					NNUM: this.materList[0].NNUM
				}
				// console.log( _self.userInfo);
				_self.axios({
						url: URL,
						data: savedata,
						isLoading: true
					})
					.then(res => {
						let {
							IsSuccess,
							Message
						} = res;
						_self.setCheckData([]);
						_self.$utils.tips('提交成功')
						setTimeout( ()=>{
							uni.$emit('refreshList', {
								isRefresh: true
							})
							uni.navigateBack({})
						},1600)
					}).catch(err=>{
						let { Message } = err
						console.log(err);
					})
			},
			onConfirm(val) {
				this.mainTable[dateTimekey] = val.result;
			},
			
			handelScan(index,t){
				let URL = this.userInfo.BaseURL + '/api/APPCommon/ScanCode';
				// console.log(URL);
				let that = this ;
				this.$utils.Scan(URL, data => {
					if(t == 'BD_STORE'){
						_self.materList[index].VDEF16 = data.PK_STORE
						_self.materList[index].VDEF17   = data.STORENAME 
						return ;
					}
					// console.log(data);
					if(data.PK_STATION != _self.materList[index].PK_STATION ){
						this.mainTable.VDEF20  = 1
						_self.materList[index].VDEF20  = 1 // 非原位归还
					}
					// _self.materList[index].PK_STORE = data.PK_STORE
					// _self.materList[index].STORENAME = data.STORENAME
					_self.materList[index].VDEF18 = data.STATIONNAME 
					_self.materList[index].VDEF19   = data.PK_STATION
					
				})
			},
			
			getDetail() {
				// let URL =  '/api/APPCommon/GetList_OutStcokRecordDTL'; 旧版本
				let URL =  '/api/APPCommon/GetListPage_TC_TOOLRECORD_DTL';
				_self.axios({
						url: URL,
						data: query,
						isLoading: true
					})
					.then(res => {
						let {
							IsSuccess,
							Message,
							Result
						} = res;
						let Arrays = Result.rows.map(item=>{
							item.RENNUM = ""
							item.VDEF20  = 0
							item.VMEMO = ""
							return item;
						})
						_self.materList = Arrays
						// console.log(Result);
					})
			},

			dateEvent(id) {
				if(this.orderType==1 && id=='APPLYERDATE' ) return;
				dateTimekey = id;
				this.$refs.dateTime.show();
			},
			// 返回
			addItem(){
				uni.navigateBack({})
			},
			// 物资扫描
			openScanMater(){
				let URL =  api.apiPublic.ScanCode;
				this.$utils.Scan(URL, item => {
					item.ischeck = false;
					item.LENDNNUM = '1'; // 借出数量
					item.ENNUM = ''; // 归还数量
					item.TARENNUM = '' // 已归还数量
					item.WAITNNUM = '' // 待归还数量
					let TNT  = [..._self.checkData];
					TNT.push(item)
					_self.setCheckData(TNT);
					_self.materList = _self.checkData
				});
			},
			
		}
	}
</script>

<style lang="scss">
	.text-blue {
		color: #1677ff;
	}
	.detail-scan-btn{
		position: absolute;
		right: 6rpx;
		top: 10rpx;
	}
	.ban-flag::after{
		content: '*';
		color: red;
		display: inline;
		position: absolute;
		left: 128rpx;
	}
</style>
